<?
include_once("./head.php");
?>
<!doctype html>
	<html>
	<head>
	<title>register</title>
	<meta charset="utf-8">
	</head>
	<style>
		.c1{
			width:150px;
			/*border:1px solid red;*/
			margin-left:150px;
			margin-top:30px;
			}
		.c2{
			/*border:1px solid red;*/
			width:377px;
			height:289px;
			float:left;
			margin-left:150px;
			margin-top:30px;
		}
		
		.c3{
			width:500px;
			height:500px;
			/*border:1px solid red;*/
			float:right;
			margin-right:130px;
			margin-top:35px;
		}
		.c4{
			width:360px;
			height:80px;
			/*border:1px solid red;*/
			margin-left:150px;
			margin-top:-200px;
		}
		.zhuce{
			width:200px;
			height:50px;
			/*border:1px solid red;*/
			margin-left:70px;
			background:#66D9EF;
			font-size:20px;
			color:white;
		}
		
	</style>
	<body>
		
		<div class="c1">
			<font size="4px">注册欣才商城账号</font>
		</div>
		<div class="c2">
			<img src="./img/2.png"><br>
		</div>
		<div class="c3">
			<form action="./register4.php" method="post" onsubmit="return ck()">
				账户&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<input size="30px" type="text" name="account"  placeholder="请输入用户名" id="accoun">
				<span id="zspan"></span>
				<br><br>
				密码&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<input size="30px" type="password" name="pwd"  placeholder="请输入密码" id="pwd_p">
				<span id="zspan1"></span><br><br><br><hr>
				<br>
				手机号码&nbsp;&nbsp;&nbsp;<input size="30px" type="text" name="number"placeholder="请输入手机号" id="phone">
				<span id="zspan2"></span><br><br>
				邮箱&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<input size="30px" type="text" name="email" value="" placeholder="请输入邮箱" id="email">
				<span id="zspan3"></span><br><br>
				头像
				<img src="./touxiang/1.jpg" width="50px">
				<input type="radio" name="touxiang" value="./touxiang/1.jpg">
				<img src="./touxiang/2.jpg" width="50px">
				<input type="radio" name="touxiang" value="./touxiang/2.jpg">
				<img src="./touxiang/3.jpg" width="50px">
				<input type="radio" name="touxiang" value="./touxiang/3.jpg">
				<img src="./touxiang/4.jpg" width="50px">
				<input type="radio" name="touxiang" value="./touxiang/4.jpg">
				<hr>
				<input type="submit" name="sub" value="注册" class="zhuce">
			</form>
		</div>
			<div style="clear:both"></div>
			<div class="c4">
				<font size="4px">知其然知其所以然</font><br>
				<p>通过我们的实战项目，您可以更全面的理解软件工程</p>
			</div>
			<script>
			accoun=document.getElementById("accoun");
			span_u=document.getElementById("zspan");

			pwd_p=document.getElementById("pwd_p");
			span_p=document.getElementById("zspan1");

			phone=document.getElementById("phone");
			span_h=document.getElementById("zspan2");

			email=document.getElementById("email");
			span_e=document.getElementById("zspan3");
			p=1;
			p1=0;
			p2=0;
			p3=0;
				accoun.onblur=function(){
					bank=accoun.value
					preg=/^\w{6,12}$/
					if(preg.test(bank)){
						span_u.innerHTML="√";
						span_u.style.color="green";
						p=1;	
					}else{
						span_u.innerHTML="*请输入6-12位字母数字";
						span_u.style.color="red";
						p=0;
					}
				}
				accoun.onfocus=function(){
					span_u.innerHTML="";
				}
				pwd_p.onblur=function(){
					pwd_d=pwd_p.value
					perg=/^\w{6,12}$/
					if(perg.test(pwd_d)){
						span_p.innerHTML="√";
						span_p.style.color="green";
						p1=1;	
					}else{
						span_p.innerHTML="*请输入6-12位字母数字";
						span_p.style.color="red";
						p1=0;
					}
				}
				pwd_p.onfocus=function(){
					span_p.innerHTML="";
				}
				phone.onblur=function(){
					phone_h=phone.value
					pergg=/^1[3,5,8,9]{1}\d{9}$/
					if(pergg.test(phone_h)){
						span_h.innerHTML="√";
						span_h.style.color="green";
						p2=1;	
					}else{
						span_h.innerHTML="*请输入正确的手机号码";
						span_h.style.color="red";
						p2=0;
					}
				}
				phone.onfocus=function(){
					span_h.innerHTML="";
				}
				email.onblur=function(){
					email_e=email.value
					peerg=/^\w{3,12}\@[a-z0-9A-Z]+\.(com|cn)$/
					if(peerg.test(email_e)){
						span_e.innerHTML="√";
						span_e.style.color="green";
						p3=1;
					}else{
						span_e.innerHTML="*请输入正确的邮箱";
						span_e.style.color="red";
						p3=0;
					}
				}
				email.onfocus=function(){
					span_h.innerHTML="";
				}
				function ck(){
					if(p==1 && p1==1 && p2==1 && p3==1){
						return true;
					}else{
						return false;
					}
				}
			</script>
		
		
	
		
	</body>
	</html>
	